cascading style sheets guide

Selectors

Now it is time to take a deep breath, and concentrate a little. I really don't believe that cascading style sheets are hard to master, but they can be a little tricky. In a few short minutes, we'll cover what I think can be the hardest part of style sheets to "get", selectors.

What do Selectors Do?

You'll probably find the constant repetition a little tedious, but I do want to reiterate what a selector does.

A selector identifies elements on a HTML page. Browsers use selectors to determine which elements on a page are affected by a statement.

Now, we saw in the previous lesson that selectors can identify HTML elements, such as paragraphs, the body, and so on. In fact, selectors can identify any html element, but they can do a lot more than that. We'll take a look at the different types of selector, then concentrate on each type, what it does, and how to use it.

Kinds of Selector

There are 7 distinct kinds of selector.

  1. HTML Element Selectors
  2. Class Selectors
  3. ID Selectors
  4. Contextual Selectors
  5. Pseudo Class Selectors
  6. Pseudo Element Selectors
  7. Selector Groups

We look at each kind of selector individually in the above sections. For each selector we ask:

In this Part

Made it this far? Well, we've covered the trickiest part of style sheets by far. We've seen each of the major kind of selector, what they do, how they are formed, and why you might use them. I really don't think you should worry if this is all still a bit of a blur. You can always refer back here, and remember, Style Master has all the help you need built right into the application, so you will never need to ask, "what do pseudo class selectors do again?"

Next

Next up we will tackle properties, that is, all of the different styles you can apply to your web pages to make them come alive.